import { defineConfig,loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue';
import Components from 'unplugin-vue-components/vite';
import { VantResolver } from 'unplugin-vue-components/resolvers';
import postCssPxToRem from 'postcss-pxtorem'
import UnoCSS from 'unocss/vite'
import autoprefixer from 'autoprefixer'
import { resolve } from 'path';
console.log(Components,"Components")

export default defineConfig(({command,mode})=>{
  const env = loadEnv(mode, process.cwd(), '')

  return{
    plugins: [
      vue(),
      Components({
        resolvers: [
          VantResolver(),
        ],
      }),
      UnoCSS()
    ],
    resolve: {
      alias: {
          '@img': resolve(__dirname, 'src/assets/image'), // 图片路径别名
          '@': resolve(__dirname, 'src/') // 根路徑
      },
      extensions: ['.js', '.json', '.ts', '.tsx', '.jsx'] // 使用路径别名时想要省略的后缀名，可以自己 增减
  },
    css: {
      postcss: {
        plugins: [
          autoprefixer({
            overrideBrowserslist: ['Android 4.1', 'iOS 7.1', 'Chrome > 31', 'ff > 31', 'ie >= 8']
          }),
           postCssPxToRem({
            // 自适应，px>rem转换
            rootValue({ file }) {
              return file.indexOf('vant') !== -1 ? 37.5 : 75;
            }, // 这里代表的是1rem等于多少rootValue的px。75表示750设计稿，37.5表示375设计稿
            propList: ['*'], // 需要转换的属性，这里选择全部都进行转换
            selectorBlackList: ['norem', 'ignore'], // 过滤掉norem-开头的class，不进行rem转换
            mediaQuery: false,  // 允许在媒体查询中转换 px
          }),
        ],
      },
      preprocessorOptions: {
        scss: {
          additionalData: `@import "@/theme.scss";`
        }
    }
    },
    server: {
      host: true,
      // proxy: {
      //   // 跨域代理
      //   '/apis': {
      //     target: 'https://api.bilibili.com/',
      //     changeOrigin: true,
      //     rewrite: (path) => path.replace(/^\/apis/, ''),
      //     headers: {
      //       referer: 'https://api.bilibili.com'
      //     }
      //   },
      //   '/test': {
      //     target: 'https://httpbin.org/',
      //     changeOrigin: true,
      //     rewrite: (path) => path.replace(/^\/test/, ''),
      //   }
      // }
    }
  
  }  
})